<template>
	<view class="main">
		<u-navbar
		title="交易消息" 
		back-icon-color="#ffffff"
		title-color="#ffffff"
		title-size="34"
		:border-bottom="false"
		:background="background">
		</u-navbar>
		<view class="content">
			<block v-for="(item,index) in 3" :key="index">
				<view class="item">
					<view class="date">2019-01-01  15:58</view>
					<view class="cont">
						<view class="title">订单支付成功</view>
						<view class="status">已支付</view>
						<view class="price">¥100.00</view>
						<view class="des">
							<view>
								<text>订单名称:</text>
								<text>整包项目托管费用(c#开发应用程序后台开发)</text>
							</view>
							<view>
								<text>订单状态:</text>
								<text>订单支付成功</text>
							</view>
							<view>
								<text>实际金额:</text>
								<text>100.00</text>
							</view>
							<view>
								<text>支付方式:</text>
								<text>微信</text>
							</view>
							<view>
								<text>原始金额:</text>
								<text>100.00</text>
							</view>
							<view>
								<text>创建时间:</text>
								<text>2020-12-30 13:55:52</text>
							</view>
							<view>
								<text>到账时间:</text>
								<text>2020-12-30 13:55:52</text>
							</view>
							<view>
								<text>订单编号:</text>
								<text>202197867579780897</text>
							</view>
							<view>
								<text>备注说明:</text>
								<text>无</text>
							</view>
						</view>
					</view>
				</view>
			</block>
		</view>
	</view>
</template>

<script>
	export default {
		components:{
			
		},
		data() {
			return {
				background: {
					backgroundColor:"#4A90E2"
				},
			}
		},
		onLoad() {
			
		},
		onShow() {
			
		},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	.main{
		min-height: 100vh;
		background-color: #f9f9f9;
		padding: 0 30rpx;
		.content{
			.item{
				.date{
					text-align: center;
					font-size: 22rpx;
					font-weight: 400;
					color: #AEAEAE;
					line-height: 30rpx;
					margin: 30rpx 32rpx;
				}
				.cont{
					background: #FFFFFF;
					border-radius: 8rpx;
					padding: 30rpx 20rpx 38rpx 20rpx;
					.title{
						font-size: 28rpx;
						font-weight: 500;
						color: #333333;
						line-height: 40rpx;
					}
					.status{
						font-size: 26rpx;
						font-weight: 400;
						color: #999999;
						line-height: 37rpx;
						margin-top: 45rpx;
						text-align: center;
					}
					.price{
						font-size: 72rpx;
						font-weight: 400;
						color: #333333;
						line-height: 100rpx;
						margin-top: 15rpx;
						text-align: center;
					}
					.des{
						margin-top: 50rpx;
						view{
							text{
								font-size: 26rpx;
								font-weight: 400;
								color: #333333;
								line-height: 48rpx;
							}
							text:first-child{
								margin-right: 20rpx;
								color: #999999;
							}
						}
					}
				}
			}
		}
	}
	
</style>
